// 生成1-50的margin-left
.generate-margin-left(@index: 1) when (@index <= 50) {
    .ml-@{index} {
        margin-left: @index * 1px;
    }
    .generate-margin-left((@index + 1))
}

// 生成1-50的margin-right
.generate-margin-right(@index: 1) when (@index <= 50) {
    .mr-@{index} {
        margin-right: @index * 1px;
    }
    .generate-margin-right((@index + 1))
}

// 生成1-50的margin-top
.generate-margin-top(@index: 1) when (@index <= 50) {
    .mt-@{index} {
        margin-top: @index * 1px;
    }
    .generate-margin-top((@index + 1))
}

// 生成1-50的margin-bottom
.generate-margin-bottom(@index: 1) when (@index <= 50) {
    .mb-@{index} {
        margin-bottom: @index * 1px;
    }
    .generate-margin-bottom((@index + 1))
}

.generate-margin-left();
.generate-margin-right();
.generate-margin-top();
.generate-margin-bottom();


// 生成1-50的padding-left
.generate-padding-left(@index: 1) when (@index <= 50) {
    .pl-@{index} {
        padding-left: @index * 1px;
    }
    .generate-padding-left((@index + 1))
}

// 生成1-50的padding-right
.generate-padding-right(@index: 1) when (@index <= 50) {
    .pr-@{index} {
        padding-right: @index * 1px;
    }
    .generate-padding-right((@index + 1))
}

// 生成1-50的padding-top
.generate-padding-top(@index: 1) when (@index <= 50) {
    .pt-@{index} {
        padding-top: @index * 1px;
    }
    .generate-padding-top((@index + 1))
}

// 生成1-50的padding-bottom
.generate-padding-bottom(@index: 1) when (@index <= 50) {
    .pb-@{index} {
        padding-bottom: @index * 1px;
    }
    .generate-padding-bottom((@index + 1))
}

.generate-padding-left();
.generate-padding-right();
.generate-padding-top();
.generate-padding-bottom();